package com.chenyuhan.myview.testViewCanvas;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.support.annotation.Nullable;
import android.util.AttributeSet;
import android.view.View;

/**
 * Created by Administrator on 2017/7/5 0005.
 */

public class TestPathViewOne extends View {
    private final String TAG = TestPathViewOne.class.getSimpleName();
    private Path mPath;//路径
    private Paint mPaint;//画笔

    private int mWidth;//控件宽
    private int mHeight;//控件高

    private float ctrX, ctrY;// 控制点的xy坐标
    private float waveY;// 整个Wave顶部两端点的Y坐标，该坐标与控制点的Y坐标增减幅一致

    public TestPathViewOne(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        //实例化画笔
        mPaint = new Paint(Paint.ANTI_ALIAS_FLAG | Paint.DITHER_FLAG);
        mPaint.setColor(Color.BLUE);
        mPaint.setStyle(Paint.Style.FILL);
        //实例化路径
        mPath = new Path();
    }

    @Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        //获取控件宽高
        mWidth = w;
        mHeight = h;

        // 计算控制点Y坐标
        waveY = 1 / 8F * mHeight;
        // 计算端点Y坐标
        ctrY = -1 / 16F * mHeight;
    }

    private boolean isInc;// 判断控制点是该右移还是左移

    @Override
    protected void onDraw(Canvas canvas) {
        /*
         * 设置Path起点
         * 注意我将Path的起点设置在了控件的外部看不到的区域
         * 如果我们将起点设置在控件左端x=0的位置会使得贝塞尔曲线变得生硬
         * 至于为什么刚才我已经说了
         * 所以我们稍微让起点往“外”走点
         */
        mPath.moveTo(-1 / 4F * mWidth, waveY);
        /*
         * 以二阶曲线的方式通过控制点连接位于控件右边的终点
         * 终点的位置也是在控件外部
         * 我们只需不断让ctrX的大小变化即可实现“浪”的效果
         */
        mPath.quadTo(ctrX, ctrY, mWidth + 1 / 4F * mWidth, waveY);

        // 围绕控件闭合曲线
        mPath.lineTo(mWidth + 1 / 4F * mWidth, mHeight);//右下角
        mPath.lineTo(-1 / 4F * mWidth, mHeight);//左下角
        mPath.close();//封闭曲线（相当于回到左上角的点）
        canvas.drawPath(mPath, mPaint);

        /*
         * 当控制点的x坐标大于或等于终点x坐标时更改标识值
         */
        if (ctrX >= mWidth + 1 / 4F * mWidth) {
            isInc = false;
        }
        /*
         * 当控制点的x坐标小于或等于起点x坐标时更改标识值
         */
        else if (ctrX <= -1 / 4F * mWidth) {
            isInc = true;
        }

        // 根据标识值判断当前的控制点x坐标是该加还是减
        ctrX = isInc ? ctrX + 20 : ctrX - 20;
        //清空路径上所有曲线
        mPath.reset();
        // 重绘
        invalidate();
    }
}
